<template>
    <div class="layout-content-container">

        <!-- 标签导航 -->
        <tags-nav></tags-nav>

        <div class="content-wrapper" :style="{height: (fullHeight - 104) + 'px'}">

            <transition name="fade" mode="out-in">
                <router-view></router-view>
            </transition>

        </div>
    </div>
</template>

<script>
import TagsNav from './components/tags-nav/tags-nav.vue'
export default {
    name: "Content",
    components: {
        TagsNav
    },
    data() {
        return {
            //设置 content-wrapper 高度
            fullHeight: document.documentElement.clientHeight
        };
    },
    mounted() {
        const that = this;
        window.onresize = () => {
            return (() => {
                that.fullHeight = document.documentElement.clientHeight;
            })();
        };
    },
    watch: {
        fullHeight(val) {
            if (!this.timer) {
                this.fullHeight = val;
                this.timer = true;
                let that = this;
                setTimeout(function() {
                    that.timer = false;
                }, 1);
            }
        }
    }
};
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
</style>